<template>
  <div class="bar">
    <h4>{{title}}</h4>
    <div class="chart">
      <v-chart :force-fit="true" height="430" :data="data" :padding="[24, 0, 6, 40]">
        <v-tooltip />
        <v-axis />
        <v-bar position="account_id*estimated_charges"/>
      </v-chart>
    </div>
  </div>
</template>

<script>
//
//const data = []
//for (let i = 0; i < 166; i += 1) {
//  data.push({
//    accountId: `ID:${i + 1}`,
//    cost: Math.floor(Math.random() * 1000) + 200
//  })
//}

export default {
  name: 'Bar',
  props: ['title','data'],
  data () {
    return {
    }
  }
}
</script>

<style scoped lang="less">
  .bar{
    position: relative;
    .chart{
    }
  }
</style>
